import { IFeidaoAiBrowserComponent } from '@feidao/web/interfaces';
import p02 from './p02';
import render from '@feidao/web/atom/browser/render/render';
import get_form_data from '@feidao/web/atom/browser/form/get-data';
import p03 from './p03';

export default async function a014(fd: IFeidaoAiBrowserComponent, ...args: any[]) {
	fd.data.node.querySelector<HTMLTextAreaElement>('[data-feidao-id="fd-w000018-005"]').innerHTML = '';

	// 获取属性，渲染p02
	const widgets = fd.data.node.querySelector<HTMLFormElement>('[name="widgets"]');
	const data = get_form_data(widgets);
	let attrs = ''; let attrs2 = '';
	for (const attr in data) {
		if (data.hasOwnProperty(attr)) {
			const v = data[attr];
			if (v === true) {
				attrs += attr + ' ';
				attrs2 += attr + ' ';
			} else {
				if (v) {
					attrs += attr + '=\'' + v + '\' ';
					if (attr !== 'data') {
						attrs2 += attr + '=\'' + v + '\' ';
					}
				}
			}
		}
	}
	render(fd, attrs, p02, 'p02', 'inner');

	const a = fd.data.node.querySelector<HTMLAreaElement>('[data-feidao-id="fd-w000018-002"]');
	a.innerHTML = '<fd-w000018 width="200px" ' + attrs + '></fd-w000018>';

	render(fd, attrs2, p03, 'p03', 'inner');
	const o = fd.data.node.querySelector<HTMLAreaElement>('[data-feidao-id="fd-w000018-003"]');
	o.innerHTML = `<fd-w000018 width="200px" ${attrs2}>
	<option data-placeholder="true"></option>
	<option value="value 1">Value 1</option>
	<option value="value 2">Value 2</option>
	<option value="value 3">Value 3</option>
</fd-w000018>`;
}
